<template>
	<div>
		<el-row :gutter="10" class="mb8">
			<el-col :span="1.5">
				<el-button type="primary" icon="el-icon-plus" size="mini" @click="addPoint">新增</el-button>
				<el-button type="default" icon="el-icon-refresh" size="mini" @click="refresh">刷新</el-button>
			</el-col>
		</el-row>
		<el-table :data="tableData">
			<el-table-column type="index" label="序号" align="center" :index="indexMethod" width="50" />
			<el-table-column label="积分事件名称" align="center" prop="pointEventName" />
			<el-table-column label="积分" align="center" prop="pointEventValue" />
			<el-table-column label="类型" align="center">
				<template slot-scope="scope">
					<span v-if="scope.row.isPlus === '0'"><el-tag type="success">增加</el-tag></span>
					<span v-if="scope.row.isPlus === '1'"><el-tag type="danger">减少</el-tag></span>
				</template>
			</el-table-column>
			<el-table-column label="年" align="center" prop="year" />
			<el-table-column label="月" align="center" prop="month" />
			<el-table-column label="日" align="center" prop="day" />
			<el-table-column label="发生时间" align="center" prop="createTime">
				<template v-slot="scope">
					{{ setHappenTime(scope.row) }}
				</template>
			</el-table-column>
			<el-table-column label="相关事项" align="center" prop="relatedTopics" />
			<el-table-column label="操作" align="center">
				<template v-slot="scope">
					<el-button type="text" icon="el-icon-edit" @click="editPoint(scope.row)">修改</el-button>
          <el-button type="text" icon="el-icon-delete" @click="deletePoint(scope.row)">删除</el-button>
				</template>
			</el-table-column>
		</el-table>
		<pagination
			v-show="total>0"
			:total="total"
			:page.sync="queryParams.pageNum"
			:limit.sync="queryParams.pageSize"
			@pagination="getList"
		/>
		<el-dialog :title="point.title" :visible.sync="point.visible" width="50%">
			<el-form ref="form" :model="form" :rules="rules" label-width="80px" size="small">
				<el-form-item label="事件名称" prop="pointEventName">
					<el-input v-model="form.pointEventName" placeholder="请输入事件名称"></el-input>
				</el-form-item>
				<el-form-item label="事件积分">
					<el-input-number v-model="form.pointEventValue" :min="1" :precision="0" placeholder="请输入事件积分" controls-position="right"></el-input-number>
				</el-form-item>
				<el-form-item label="增加/减少">
					<el-radio-group v-model="form.isPlus">
						<el-radio :label="0">增加</el-radio>
						<el-radio :label="1">减少</el-radio>
					</el-radio-group>
				</el-form-item>
				<el-form-item label="发生时间" prop="happenTime">
					<el-date-picker v-model="form.happenTime" placeholder="请选择发生时间" type="date"></el-date-picker>
				</el-form-item>
			</el-form>
			<span slot="footer" class="dialog-footer">
		    	<el-button @click="point.visible = false">取 消</el-button>
		    	<el-button type="primary" @click="doSubmit">确 定</el-button>
		  	</span>
		</el-dialog>
	</div>
</template>

<script>
import {addPoint, reducePoint, editPoint, getInfo, GetList, removePointEvent} from '@/api/point/point'
import dayjs from 'dayjs'
import {delDept} from "@/api/hospital/dept";

export default {
	name: "Point",
	props: {
		doctorId: {

		}
	},
	data() {
		return {
			tableData: [],
			queryParams: {
				pageNum: 1,
				pageSize: 10,
				doctorId: null,
				orderByColumn: 'create_time',
				isAsc: 'desc'
			},
			form: {
				pointEventId: undefined,
				pointEventName: undefined,
				pointEventValue: 0,
				isPlus: 0,
				happenTime: undefined,
				year: '',
				month: '',
				day: '',
				doctorId: undefined
			},
			total: 0,
			point: {
				visible: false,
				title: '修改',
				pointId: undefined
			},
			rules: {
				pointEventName: [{required: true, message: '请输入事件名称', trigger: 'blur'}],
				happenTime: [{required: true, message: '请选择发生时间', trigger: 'change'}]
			}
		};
	},
	mounted() {
	},
	methods: {
		getList() {
			GetList(this.queryParams).then(res => {
				if (res.code === 200) {
					this.tableData = res.rows;
					this.total = res.total;
				}
			})
		},
		refresh() {
			this.getList()
		},
		indexMethod(index) {
			return (this.queryParams.pageNum - 1) * this.queryParams.pageSize + index + 1;
		},
		addPoint() {
			this.reset();
			this.point.title = '新增';
			this.point.visible = true;
		},
		editPoint(row) {
			this.reset();
			getInfo(row.pointEventId).then(res => {
				this.form.pointEventId = res.data.pointEventId;
				this.form.pointEventName = res.data.pointEventName;
				this.form.pointEventValue = res.data.pointEventValue;
				this.form.isPlus = Number(res.data.isPlus);
				this.form.happenTime = dayjs().set('year', res.data.year).set('month', res.data.month - 1).set('date', res.data.day);
				this.point.title = '修改';
				this.point.visible = true;
			})
		},
    deletePoint(row) {
      this.$confirm('是否确认删除该数据项?', "警告", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      }).then(function() {
        return removePointEvent(row.pointEventId);
      }).then(() => {
        this.getList();
        this.msgSuccess("删除成功");
      }).catch(function() {});
    },
		doSubmit() {
			this.$refs["form"].validate(valid => {
				if (valid) {
					this.form.day = dayjs(this.form.happenTime).date();
					this.form.month = dayjs(this.form.happenTime).month() + 1;
					this.form.year = dayjs(this.form.happenTime).year();
					this.form.doctorId = this.doctorId;
					if (this.point.title === '新增') {
						if (this.form.isPlus == 0) {
							addPoint(this.form).then(res => {
								if (res.code === 200) {
									this.$message.success('操作成功');
									this.point.visible = false;
									this.getList();
									this.$emit('getDoctor');
								}
							})
						} else {
							reducePoint(this.form).then(res => {
								if (res.code === 200) {
									this.$message.success('操作成功');
									this.point.visible = false;
									this.getList();
									this.$emit('getDoctor');
								}
							})
						}
					} else if (this.point.title === '修改') {
						editPoint(this.form).then(res => {
							if (res.code === 200) {
								this.$message.success('操作成功');
								this.point.visible = false;
								this.getList();
								this.$emit('getDoctor');
							}
						})
					}
				}
			})
		},
		setHappenTime(row) {
			return dayjs().set('year', row.year).set('month', row.month - 1).set('date', row.day).format('YYYY-MM-DD');
		},
		// 表单重置
		reset() {
			this.form = {
				pointEventName: '',
				pointEventValue: 0,
				isPlus: 0,
				happenTime: '',
				year: '',
				month: '',
				day: '',
				doctorId: undefined
			};
			this.resetForm("form");
		},
	},
	watch: {
		doctorId: function() {
			this.queryParams.doctorId = this.doctorId
			this.getList();
		}
	}
}
</script>

<style lang="scss" scoped>

</style>
